<template>
    <div>
        <a-button type="link" @click="handCLick">详情</a-button>
        <a-modal v-model="visible" title="机器连线列表" :footer="null" centered>
            <div class="mobileModalWrap">
                <a-table :columns="modalColumns" :pagination="false" :data-source="item"
                    :scroll="{ y: 'calc(50vh)', x: '100%' }" size="small">
                </a-table>
            </div>
        </a-modal>
    </div>
</template>
<script>
import { modalColumns } from './js/static.js';
export default {
    name: '',
    props: {
        item: {
            type: [Object, Array],
            default: () => {
                return []
            }
        }
    },
    data() {
        return {
            visible: false,
            modalColumns,
        }
    },
    methods: {
        handCLick() {
            this.visible = true;
        }
    }
}
</script>
<style lang="less" scoped>
::v-deep {
    .ant-modal-header {
        padding: 8px 24px 8px 8px;
    }

    .ant-modal-body {
        padding: 0px;
    }

    .ant-modal-close-x {
        width: 39px;
        height: 39px;
        line-height: 39px;
    }
}

.mobileModalWrap {
    max-height: 50vh;
}
</style>